@extends('plugin.hostserver.front.layout.base')
@section('content')
    <div id="pageTitle" class="HeaderAdjust" data-bg-src="img/background-img/page-title-bg.jpg"
         style="background-image: url(&quot;img/background-img/page-title-bg.jpg&quot;); margin-top: 220px;">
        <div class="container">
            <div class="row">
                <div class="col-md-6 col-md-offset-3">
                    <div class="section-title">
                        <h2>续费 {{ $show['name']}}</h2>
                    </div>

                </div>
            </div>
        </div>
    </div>
    <div id="contact" class="page">
        <div class="container">
            <div class="row">
                <div class="col-sm-6">

                    <div class="contact-address">
                        <h2>{{ $show['name'] }}</h2>
                        <h3>价格: {{ $show['money'] }} /月 </h3>

                        <address>
                            <p>cpu: <span>{{ $show['cpu'] }} 核</span></p>
                            <p>内存: <span>{{ $show['memory'] }} G</span></p>
                            <p>硬盘: <span>{{ $show['disk'] }} GB {{ $show['disk_type'] }}</span></p>
                            <p>宽带: <span>{{ $show['bandwidth'] }} M</span></p>
                            <p>特点: {!! ($show['feature'])  !!}</p>
                            <p>防御: {!! ($show['defense_feature'])  !!}</p>

                            <p>地区: <span>{{ $show['area'] }}</span></p>

                            <p>介绍: {!! ($show['intro'])  !!}</p>

                        </address>


                    </div>

                </div>
                <div class="col-sm-6 contact-form">
                    <form id="contactForm" method="post" action="{{ plugin_route('hostserver.user.renewal.good') }}">
                        @csrf
                        <input type="hidden" name="id" value="{{ $show['id'] }}" class="form-control" id="id" >
                        <input type="hidden" name="order_id" value="{{ $order['id'] }}" class="form-control" id="id" >

                        <input type="hidden" name="money" value="{{$show['money']}}">
                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="name">续费多少个月</label>
                                    <input type="number" value="1" name="month" rq="1" data-reg="min" id="month"
                                           data-min="1" class="form-control"
                                           placeholder="续费多少个月">
                                </div>
                            </div>

                        </div>

                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="name">交易密码</label>
                                    <input type="password" name="buy_password" rq="1" data-tip="请输入交易密码"
                                           id="buy_password" class="form-control"
                                           placeholder="交易密码">
                                </div>
                            </div>
                        </div>

                        <div class="contact-form-status">总消费: &nbsp;&nbsp;&nbsp;<span style="color: #FF5722;"
                                                                                      id="count_money"> 0</span> 元
                        </div>
                        <br>

                        <button type="buttom" class="btn submit-button ajax-submit">续费</button>
                    </form>
                </div>
            </div>
        </div>
    </div>
@endsection
@section('foot_js')
    <script>
        $(function () {
            var good_id = '{{ $show['id'] }}';
            $("#system_name").change(function () {
                var id = $(this).find('option:selected').data('id');
                console.log(id);
                if (id) {
                    ajax(urlConfigApi.system, {id: id, good_id: good_id}, function (res) {
                        if (res.code == 200) {
                            var html = '';
                            for (var i in res.data) {
                                var item = res.data[i];
                                html += '<option value="' + item.name + '">' + item.name + '</option>'
                            }
                            $("#system_detail").empty().append(html);
                        } else {
                            $("#system_detail").empty();
                        }
                    })
                }
            })
            total();
            $("#month").keyup(function(){
                var month=$(this).val();

                if(!isNaN(month))
                {
                    total();
                }
            })
            //计算价格
            function total(){
                var month=$("#month").val();
                var money="{{$show['money']}}";
                $("#count_money").text(money*month);
            }
        })
    </script>

@endsection